#include("/common/_layout.html")
#@layout()
#define layoutHead()
	<title>内容列表</title>
#end
#define layoutBody()
	<body>
		<div class="wrap-container clearfix">
				<div class="column-content-detail">
					<div class="layui-form">
						<div class="layui-form-item">
							<div class="layui-inline tool-btn">
								<button class="layui-btn layui-btn-small layui-btn-normal useBtn" data-url="/api/eduorg/article/usestate/1">采用</button>
								<button class="layui-btn layui-btn-small layui-btn-danger useBtn"  data-url="/api/eduorg/article/usestate/0">不采用</button>
							</div>
							<div class="layui-inline">
								<select id="cat_id" name="cat_id" lay-filter="cat_id">
									<option value="0">全部栏目</option>
								</select>
							</div>
							<div class="layui-inline">
								<select id="use_state" name="use_state" lay-filter="use_state">
									<option value="-100" checked>全部</option>
									<option value="1">采用</option>
									<option value="0">不采用</option>
								</select>
							</div>
							<div class="layui-inline">
								<input type="text" id="keywords" name="keywords" placeholder="请输入关键字" autocomplete="off" class="layui-input">
							</div>
							<button class="layui-btn layui-btn-normal" id="btn_search">搜索</button>
						</div>
					</div>
					<div class="layui-form" id="table-list">
						<table class="layui-table" lay-even lay-skin="nob">
							<colgroup>
								<col width="50">
								<col class="hidden-xs" width="50" style="display:none">
								<col class="hidden-xs" width="100">
								<col>
								<col class="hidden-xs" width="160">
								<col width="90">
								<col width="150">
							</colgroup>
							<thead>
								<tr>
									<th><input type="checkbox" name="allChoose" lay-skin="primary" lay-filter="allChoose"></th>
									<th class="hidden-xs" style="display:none">ID</th>
									<th class="hidden-xs">栏目</th>
									<th>内容标题</th>
									<th class="hidden-xs">发布时间</th>
									<th>是否采用</th>
									<th>操作</th>
								</tr>
							</thead>
							<tbody id="listTbody">
							</tbody>
						</table>
						<div class="page-wrap">
							<div id="divPager"></div>
						</div>
					</div>
				</div>
		</div>
		<!-- #[[ -->
		<script id="tplTbody" type="text/html">
			{{#  layui.each(d.rows, function(index, item){ }}
				<tr>
					<td><input type="checkbox" name="oneChoose" lay-skin="primary" lay-filter="oneChoose" data-id="{{ item.article_id }}"/></td>
					<td class="hidden-xs" style="display:none">{{ item.article_id }}</td>
					<td class="hidden-xs">{{ item.cat_name }}</td>
					<td>{{ item.article_title }}</td>
					<td class="hidden-xs">{{ item.add_time }}</td>
					<td class="hidden-xs">{{ (isNull(item.use_state))?'采用':'不采用' }}</td>
					<td>
						<div class="layui-inline">
							<button class="layui-btn layui-btn-small layui-btn-normal go-btn" data-id="{{ item.article_id }}" data-url="/admin/eduorg/edit/article?app_id={{ d.app_id }}&typeid={{ item.type_id }}">查看</button>
						</div>
					</td>
				</tr>
			{{#  }); }}
			{{#  if(d.length === 0){ }}
			  无数据
			{{#  } }} 
		</script>
		<!-- ]]# -->
		<script type="text/javascript">
			
		var page_jump_num = 0;
		var initno = 1;
		var url_cat_id = getUrlParam("cat_id");
		
		layui.use(['layer', 'laypage', 'laytpl', 'form', 'dialog'], function(){
			var laypage = layui.laypage
			,layer = layui.layer
			,laytpl = layui.laytpl
			,dialog = layui.dialog;
			var form = layui.form();
			
			//顶部批量删除
			$('.useBtn').click(function() {
				var surl=$(this).attr('data-url');
				var stitle = $(this).text();
				var iids = "";
				$('input[lay-filter="oneChoose"]').each(function(){
					if ($(this).prop("checked")){
						iids += $(this).attr('data-id') + ',';
					}
				});
				if (iids.length<=0){
					layer.msg('请先选择要'+stitle+'的项！');
					return false;
				}
				dialog.confirm({
					message:'您确定要'+stitle+'选中项',
					success:function(){
						$.ajax({
							url: surl,
							type: "POST",
							data: {ids: iids},
							cache: false,
							dataType: 'json',
							success: function(response){
								layer.msg(response.msg);
								if (response.code == 200){
									$('#btn_search').click();
								}
							},
							error:function(response) {
								layer.msg("ajax error: " + response);
							},
						});
					},
					cancel:function(){
						//layer.msg('取消了')
					}
				})
				return false;
			
			});
			
			$('#btn_search').click(function(){
				page_jump_num = 0;
				getPageData(1);
			});
			form.on('select(cat_id)', function(data){
				page_jump_num = 0;
				getPageData(1);
			});
			
			function bindSelectData(listdata, pid, level){
				var rows = listdata.filter(function (e) { return e.parent_id == pid && (e.link_course === 0 || e.link_course === false); });
				for (var i = 0; i < rows.length; i++) {
					var shtml = '<option value="'+rows[i].cat_id+'">';
					for(j=0;j<level;j++){
						shtml += '&nbsp;&nbsp;&nbsp;&nbsp;';
					}
					if (level>0){
						shtml += '├─';
					}
					shtml += rows[i].cat_name + '</option>';
					document.getElementById('cat_id').innerHTML += shtml;
					// 迭代
					bindSelectData(listdata, rows[i].cat_id, level+1);
				}
			}

			// render pager
			function renderPage(totalPage){
				if (totalPage>0){
					page_jump_num = 0;
					laypage.render({
						elem: 'divPager'
						,count: totalPage
						,limit: global_pagesize
						,jump: function(obj){
							
							//首次不执行
							if(page_jump_num>0){
								//console.log(obj);
								getPageData(obj.curr);
							}
							
							page_jump_num++;
						}
					});
				}
			}

			// render table
			function renderTable(listData){
				var getTpl = document.getElementById('tplTbody').innerHTML;
				laytpl(getTpl).render(listData, function(html){
					document.getElementById('listTbody').innerHTML = html;
				});
				form.render("checkbox");
			}

			// get page data
			function getPageData(pageNo){
				var surl = "/api/eduorg/article/getPage?pageNo=" + pageNo + "&pageSize=" + global_pagesize+ "&state=1&usestate=" + $('#use_state').val() + "&keywords=" + $('#keywords').val() + "&cat_id=" + $('#cat_id').val() + "&initno=" + initno + "&type_id=" + getUrlParam("typeid");
				
				initno++;
				document.getElementById('listTbody').innerHTML = "";
				
				sendPost(surl, null, function(res){
					//console.log(res);
					if (res.hasOwnProperty("listcat")) {
						bindSelectData(res.listcat, 0, 0);
						form.render('select');
					}
					
					
					// 首页，渲染分页
					if (page_jump_num == 0){
						renderPage(res.pageData.totalRow);
					}
					if (res.pageData.list.length>0){
						var jdata = {app_id: #(login_app_id), rows: res.pageData.list };
						renderTable(jdata);
					}
				});
			}
			
			getPageData(1);
		});

		
		</script>
	</body>

#end